<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 1.数组解构 允许我们按照一一对应的关系从数组中提取值

        // let arr  = [ 1,2,3]
        // (1).es6之前取出数组里的值需要重复声明变量
        // arr[0]
        // arr[1]
        // arr[2]

        // (2).es6可以使用let关键字解构数组 效率会更高 无需声明额外变量
        // 左边数组里是变量 一一对应 arr变量里的数据
        // 对应不上的变量 返回undefined
        // let [a,b,c,d,e] = arr
        // console.log(a);
        // console.log(b);
        // console.log(c);
        // console.log(d);//undefined
        // console.log(e);//undefined

        // 2.对象解构 有两种写法 对象解构允许我们使用变量名匹配对象的属性 匹配成功将对象属性的值赋值给变量
        let o = {
            name: 'andy',
            age: 18,
            sex: '男'

        }
        // (1) 大括号里的是变量 一一对应对象里的属性
        // let { name, age, sex } = o
        // console.log(name);//andy
        // console.log(age);//18
        // console.log(sex);//男

        // (2) 与1不同 在解构里冒号左边属性只用与对象属性匹配 冒号右边的才是真正的变量
        let { name: myName, age: myAge, sex: mySex } = o
        console.log(myName);//andy

    </script>
</body>

</html>